<html>
<head>
    <link rel="stylesheet" href="./videojs-mobile-ui.css">
    <link rel="stylesheet" href="./video-js.min.css">
    <script src="./jquery-1.8.0.js"></script>
    <script src="./video.min.js"></script>
    <script src="./videojs-mobile-ui.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
</head>
<body>
<!--<div id="my-video"></div>-->
<video-js id="my-video" class="video-js vjs-default-skin" controls preload="auto" width="500%" height="600px"
       data-setup='{}'>
<!--    <source src="index.mp4" type="application/x-mpegURL">-->
    <source src="index.mp4" type="video/mp4">
</video-js>


<script>
    $(document).ready(function () {
        //var videojs = require('video.js');

        // The actual plugin function is exported by this module, but it is also
        // attached to the `Player.prototype`; so, there is no need to assign it
        // to a variable.
        //require('videojs-mobile-ui');
        var player = videojs('my-video');
        alert(player);
        player.mobileUi();
    });
</script>
</body>


</html>